<template>
	<!-- 联系人信息 -->
	<div >
		<FilterTable
			ref="table"
			height="300"
			:columns="columns"
			:dataSource="pdata.majorProjectContact.list"
			:isColumnFilter="false"
			:isSelectColumn="false"
			:isToperInfo="false"
			columnsRef='customerManage_approvalManage_approvalDetails_infoContact_01'
			:onColumnsChange="columns => this.columns = columns"
		>
			<template slot="controls" v-if="!isShow">
				<el-button size="small" type="primary" icon="el-icon-plus" @click="addContact">新增</el-button>
			</template>
		</FilterTable>
		<!-- 弹窗 -->
		<BaseDialog
			title="联系人信息"
			:visible.sync="visibleDialog"
			destroyOnClose
			:containerStyle="{width:'50vm',height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
		>
			<contact-from ref="contactFrom" :contactData="contactData" @close="closeDialog" @saveClose="saveCloseDialog" @editClose="editClose"/>
		</BaseDialog>
	</div>
</template>

<script>
	import { dictionary } from '@/utils/dictMixin';
	import contactFrom from './contactFrom'

	export default {
		mixins: [dictionary],
		components: {
			contactFrom
		},
		model:{
			prop:'pdata',
			event:'click'
		},
		props: {
			pdata: {
				type: Object,
				default: () => ({})
			},
			formType:{
				type: String,
				required:true
			}
		},
		data() {
			return {
				visibleDialog:false,
				contactData:{},
				columns: this.creatHeader(),
				isShow:(this.formType === "show")
			};
		},
		// mounted(){
		// 	console.log("infoContact.this =>",this);
		// },
		methods: {
			//初始化数据
			init() {
				this.pdata.majorProjectContact.list = this.pdata.allForm.majorProjectContactList;
				this.pdata.majorProjectContact.total = this.pdata.majorProjectContact.list.length
				let columnActionIndex = null;
				//赋值
				if(this.isShow){
					this.columns.forEach((x,index) => {
						x.editable = false;
						if(x.dataIndex === 'column-action'){
							columnActionIndex = index;
						}
					});
				}
				if(columnActionIndex != null){
					this.columns.splice(columnActionIndex,1);
				}
			},
			//打开添加窗口
			addContact(){
				this.contactData = {
					type:'add'
				};
				this.visibleDialog = true;
			},
			//关闭添加窗口
			closeDialog(data){
				this.visibleDialog = false;
			},
			editHandle(props){
				this.contactData = {
					type:'edit',
					row:props.row,
					rowNo:props.$index
				};
				// console.log(this.contactData);
				this.visibleDialog = true;
			},
			//删除行方法
			deleteHandle(row){
				this.$confirm('是否确定删除吗？', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(async() => {
					this.pdata.majorProjectContact.list.splice(row.$index,1);
				}).catch(() => {});
			},
			saveCloseDialog(data){
				this.visibleDialog = false;
				// data.map(x => IsEdit:true);
				let contactData = {
					"contactType":"","contactName":"","contactSex":"","contactJob":"","contactMobile":"","contactEmail":"","birthday":"","homeAddress":"","hobby":"",
					"contactTypeIsEdit":true,"contactNameIsEdit":true,"contactSexIsEdit":true,"contactJobIsEdit":true,"contactMobileIsEdit":true,"contactEmailIsEdit":true,"birthdayIsEdit":true,"homeAddressIsEdit":true,"hobbyIsEdit":true
				};
				data = Object.assign(contactData,data);
				this.pdata.majorProjectContact.list.push(data);
				// this.pdata.majorProjectContact.total = this.pdata.majorProjectContact.list.length
			},
			editClose(data){
				if(data){
					let contactData = {
						"contactType":"","contactName":"","contactSex":"","contactJob":"","contactMobile":"","contactEmail":"","birthday":"","homeAddress":"","hobby":"",
						"contactTypeIsEdit":true,"contactNameIsEdit":true,"contactSexIsEdit":true,"contactJobIsEdit":true,"contactMobileIsEdit":true,"contactEmailIsEdit":true,"birthdayIsEdit":true,"homeAddressIsEdit":true,"hobbyIsEdit":true
					};
					data.data = Object.assign(contactData,data.data);
					this.pdata.majorProjectContact.list[data.rowNo] = data.data;
				}
				this.visibleDialog = false;
			},
			saveDialog(){
				if(this.$refs.table.$refs.pageTable.GET_REQUIRED_ERROR() == null){
					//合并数据
					Object.assign(this.pdata.allForm.majorProjectContactList,this.pdata.majorProjectContact.list);
					this.pdata.allForm.majorProjectContactList.forEach(x => {
						if(String(x.birthday).indexOf(" 00:00:00") == -1){
							x.birthday = x.birthday + " 00:00:00";
						}
					});
					this.$emit('formchange', this.pdata);
				}
			},
			//table表头和数据源
			creatHeader() {
				return [
					{
						title: '序号',
						dataIndex: 'index',
						width: 80,
						sorter: true,
						render: props => {
							// console.log('props.$index =>',props.$index)
							return <span>{props.$index + 1}</span>;
						}
					},
					{
						title: '操作',
						dataIndex: 'column-action',
						width: 100,
						fixed: 'left',
						render: (props, h) => {
							return (
							<div>
								<el-button size="mini" type="text" onClick={() => this.editHandle(props)}>
									编辑
								</el-button>
								<el-button size="mini" type="text" onClick={() => this.deleteHandle(props.row)}>
									删除
								</el-button>
							</div>
							);
						}
					},
					{ title: '联系人类型', dataIndex: 'contactType', sorter: true, editable: true, defaultEditable: true, editType: 'select',
						minWidth:'150',
						editItems:this.createDictList('2517'),
						editDisableRender: props => {
							return <span>{this.createDictText(props.row.contactType, '2517')}</span>;
						}
					},
					{ title: '姓名', dataIndex: 'contactName', sorter: true, editable: true, defaultEditable: true, editType: 'text',editRequired:true,maxlength:100,minWidth:'150',},
					{ title: '性别', dataIndex: 'contactSex', sorter: true, editable: true, defaultEditable: true, editType: 'select',
						minWidth:'150',
						editItems:this.createDictList('1002'),
						editDisableRender: props => {
							return <span>{this.createDictText(props.row.contactSex, '1002')}</span>;
						}
					},
					{ title: '职务', dataIndex: 'contactJob', sorter: true, editable: true, defaultEditable: true, editType: 'text',maxlength:100,minWidth:'150',},
					// { title: '手机', dataIndex: 'contactMobile', sorter: true, editable: true, defaultEditable: true, editType: 'text',editRequired:true,maxlength:100,
					// 	minWidth:'150',
					// 	// editPattern:/^[1][3,4,5,7,8][0-9]{9}$/
					// },
					{ title: '手机', dataIndex: 'contactMobile', sorter: true, editable: true, defaultEditable: true,editRequired:true, editType: 'number',precision:0,max:99999999999,
						minWidth:'150',
						editPattern:/^[1][3,4,5,7,8][0-9]{9}$/
					},
					{ title: '邮箱', dataIndex: 'contactEmail', sorter: true, editable: true, defaultEditable: true, editType: 'text',maxlength:100,minWidth:'150',
						editPattern:/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
					},
					{ title: '出生日期', dataIndex: 'birthday', sorter: true, editable: true, defaultEditable: true, editType: 'date-picker', dateFormat: 'yyyy-MM-dd',minWidth:'150',},
					{ title: '家庭住址', dataIndex: 'homeAddress', sorter: true, editable: true, defaultEditable: true, editType: 'text',maxlength:100,minWidth:'150',},
					{ title: '个人喜好', dataIndex: 'hobby', sorter: true, editable: true, defaultEditable: true, editType: 'text',maxlength:200,minWidth:'150',}
				];
			}
		}
	};
</script>

<style lang="less" scoped>
</style>
